import React, { useState, useEffect } from 'react';
// import { getCompanyTree } from '@/services/components/userform';
import { Table, message, Row, Col } from 'antd';
// import { history } from 'umi';
import moment from 'moment/moment';
import { getTaskSteps } from '../../../../services/task';
import { TaskOperateType } from '../../../../utils';
import { TaskSteps } from '../../../../components';
import ScoreDetail from './ScoreDetail';
import EstimateDetail from './EstimateDetail';
import {
    showPressInfoModal,
    showProgressInfoModal,
    showAuditRefuseInfoModal,
    showBackInfoModal,
    showTransferInfoModal,
    showAcceptanceFailedInfoModal,
    showTurnDoingInfoModal,
    showChangeInfoModal,
    showDelayInfoModal,
    showTurnFinishInfoModal,
    showPauseInfoModal,
    showCancelInfoModal
} from '../../../containers/MyTaskInfoModal';
// import { getActionItem } from '../../../../utils/utils';
const TaskLink = ({ location, activeKey, refreshComp }) => {
    const { query: urlQuery } = location;

    const [loading, setLoading] = useState(false);
    const [recordList, setRecordList] = useState([]);
    const [stepList, setTaskStepList] = useState([]);
    const [step, setStep] = useState();

    const ScoreDetailRef = React.useRef();
    const EstimateDetailRef = React.useRef();
    const estimateModalTypeList = [
        TaskOperateType.ESTIMATION, // 估算
        TaskOperateType.LAUNCH_ESTIMATION, // 发起估算
        TaskOperateType.RESUME_ESTIMATION, // 重估
        TaskOperateType.LAUNCH_RESUME_ESTIMATION_APPLY // 发起重估申请
    ];
    const scoreModalTypeList = [
        TaskOperateType.LAUNCH_SCORE, // 发起评分
        TaskOperateType.SCORE, // 评分
        TaskOperateType.RECHECK, // 重评
        TaskOperateType.RECHECK_APPLY, // 重评申请
        TaskOperateType.ABANDON_SCORE, // 放弃评分
        TaskOperateType.AUTO_SCORE // 自动评分
    ];

    const scoreModalList = scoreModalTypeList.reduce((prev, curr) => {
        const newPrev = { ...prev };
        newPrev[curr] = (id, operateRecordId) => ScoreDetailRef.current.showScoreModal(id, operateRecordId, curr);
        return newPrev;
    }, {});
    const estimateModalList = estimateModalTypeList.reduce((prev, curr) => {
        const newPrev = { ...prev };
        newPrev[curr] = (id, operateRecordId) => EstimateDetailRef.current.showEstimateModal(id, operateRecordId, curr);
        return newPrev;
    }, {});

    const MODALS = {
        // 评分相关
        ...scoreModalList,
        // 估算相关
        ...estimateModalList,
        // 变更
        [TaskOperateType.CHANGE]: (id, operateRecordId) => showChangeInfoModal(id, operateRecordId),
        // 催办
        [TaskOperateType.PRESS]: (id, operateRecordId) => showPressInfoModal(id, operateRecordId),
        // 审核不通过
        [TaskOperateType.AUDIT_REFUSE]: (id, operateRecordId) => showAuditRefuseInfoModal(id, operateRecordId),
        // 填写进度
        [TaskOperateType.WRITE_PROGRESS]: (id, operateRecordId) => showProgressInfoModal(id, operateRecordId),
        // 转进行中
        [TaskOperateType.TURN_DOING]: (id, operateRecordId) => showTurnDoingInfoModal(id, operateRecordId),
        // 延期
        [TaskOperateType.DELAY]: (id, operateRecordId) => showDelayInfoModal(id, operateRecordId),
        // 退回
        [TaskOperateType.BACK]: (id, operateRecordId) => showBackInfoModal(id, operateRecordId),
        // 转派
        [TaskOperateType.TRANSFER]: (id, operateRecordId) => showTransferInfoModal(id, operateRecordId),
        // 验收不通过
        [TaskOperateType.ACCEPTANCE_FAILED]: (id, operateRecordId) =>
            showAcceptanceFailedInfoModal(id, operateRecordId),
        // 转已完成
        [TaskOperateType.TURN_FINISH]: (id, operateRecordId) => showTurnFinishInfoModal(id, operateRecordId),
        // 暂停
        [TaskOperateType.PAUSE]: (id, operateRecordId) => showPauseInfoModal(id, operateRecordId),
        // 取消
        [TaskOperateType.CANCEL]: (id, operateRecordId) => showCancelInfoModal(id, operateRecordId)
    };
    const isScoreStage = operateCode => scoreModalTypeList.includes(operateCode);

    const columns = [
        {
            title: '序号',
            dataIndex: 'id',
            key: 'id',
            render(text, record, index) {
                return index + 1;
            }
        },
        {
            title: '环节名称',
            dataIndex: 'stepName',
            key: 'stepName'
        },
        {
            title: '操作人',
            dataIndex: 'operateEmployeeName',
            key: 'operateEmployeeName'
        },
        {
            title: '操作项',
            dataIndex: 'operateName',
            key: 'operateName'
        },
        {
            title: '操作时间',
            dataIndex: 'operateTime',
            key: 'operateTime',
            render: (text, record) => <span>{moment(record.operateTime).format('YYYY-MM-DD HH:mm')}</span>
        },
        {
            title: '备注',
            dataIndex: 'operateRemark',
            key: 'operateRemark',
            render: (text, record) => {
                const { operateRemark, operateCode } = record;
                const vo = operateRemark && JSON.parse(operateRemark);
                const m = MODALS[operateCode];
                return (
                    ((!!vo && !!m) || isScoreStage(operateCode)) && (
                        <span
                            title="查看详情"
                            style={{ color: '#ffa808', cursor: 'pointer' }}
                            onClick={async () => {
                                if (loading) return;
                                setLoading(true);
                                try {
                                    await m(urlQuery.id, record.id);
                                } catch (e) {
                                    console.error(e);
                                } finally {
                                    setLoading(false);
                                }
                            }}
                        >
                            查看详情
                        </span>
                    )
                );
            }
        }
    ];

    const fetchSubtask = async () => {
        setLoading(true);
        const params = {
            id: urlQuery.id
        };
        const result = await getTaskSteps(params);

        if (result.code === 10000) {
            const { data = {} } = result;
            const { taskStep, taskStepList, operateRecordList } = data;
            setRecordList(operateRecordList || []);
            setTaskStepList(taskStepList || []);
            setStep(taskStep);
        } else {
            message.error(result.msg);
        }
        setLoading(false);
    };

    useEffect(() => {
        if (activeKey === 'taskLink') {
            fetchSubtask();
        }
    }, [activeKey, refreshComp]);

    return (
        <Row>
            <Row style={{ overflowX: 'auto' }}>
                <Col style={{ display: 'flex', justifyContent: 'center' }}>
                    <TaskSteps step={step} stepList={stepList} type="notTime" style={{ margin: '30px 0' }}></TaskSteps>
                </Col>
            </Row>
            <Table
                loading={loading}
                defaultExpandAllRows
                columns={columns}
                rowKey="id"
                scroll={{ x: 'max-content' }}
                dataSource={recordList}
                pagination={false}
            />
            <ScoreDetail ScoreDetailRef={ScoreDetailRef} />
            <EstimateDetail EstimateDetailRef={EstimateDetailRef} />
        </Row>
    );
};

export default TaskLink;
